﻿@import "../../lib/bootstrap-3.3.7/less/variables.less";

@contailer-zindex:100;
@header-zindex: @contailer-zindex + 10;
@footer-zindex: @contailer-zindex + 10;
@loading-zindex: @contailer-zindex + 10;
@bg-color: white;

top-bar {
  position: absolute;
  z-index: @header-zindex + 10;
  width: 100%;
}

bottom-bar {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: @footer-zindex + 10;
}

page-loading{
    height: 100%;
    width: 100%;
    text-align: center;
}

scroll-view[scroll-type='iscroll']{
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
    -o-text-size-adjust: none;
    text-size-adjust: none;
    
    scroller {
        top: 0;
        left: 0;
        position: absolute;
        width: 100%;
        min-height: 100%;
        z-index: 80;
        background-color: @bg-color;
    }
}

scroll-view[scroll-type="div"] {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 100;
    scroller {
        width: 100%;
        height: 100%;
        top: 0px;
        left: 0px;
        position: absolute;
        overflow-y: scroll;

        background-color: white;
        -webkit-overflow-scrolling: touch;
    }
}

.page-container {
    width: 100%;
    height: 100%;
    background-color: @bg-color;
    position: fixed;
    z-index: 100;
    text-align: left;
    //.page-node {
   
    
    .page-loading {
        top: 0;
        position: absolute;
        width: 100%;
        min-height: 100%;
        font-size: 100px;
        text-align: center;
        z-index: @loading-zindex;
        background-color: @bg-color;
    }
    
    .spin {
        padding-top: 150px;
        .icon-spinner {
            color: @brand-primary;
            font-size: 140px;
        }
    }
}

/*---------------------------------*/
/* DIV Fixed 样式*/
.page-node.div .page-header {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: @header-zindex;
    margin: 0px;
    padding: 0;
    border-bottom: none;
}



.page-node.div .page-body {
    width: 100%;
    height: 100%;
    background-color: @bg-color;
    position: absolute;
    overflow-y: scroll;
    /*-webkit-overflow-scrolling: touch;*/
}

.page-node.div .page-loading {
    width: 100%;
    height: 100%;
    background-color: @bg-color;
    font-size: 100px;
    text-align: center;
}

.page-node.div .page-footer {
    width: 100%;
    position: fixed;
    bottom: 0;
    z-index: @footer-zindex;
}

/*---------------------------------*/
.page-node.doc {
    width: 100%;
    min-height: 100%;
}

.page-node.doc .page-body {
    min-height: 100%;
}

.page-node.doc .page-header {
    position: fixed;
    top: 0;
    z-index: @header-zindex;
}

.page-node.doc .page-loading {
    width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: center;
}

.page-node.doc .page-footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: @footer-zindex;
}

